<template>
  <van-pull-refresh v-model="refreshing" @refresh="OnRefresh">
    <van-list
      v-model:loading="loading"
      :finished="finished"
      finished-text="暂无更多消费记录"
      @load="OnLoad"
    >
      <div class="list">
        <div class="item" v-for="item in list">
          <p>{{ item.content }}</p>
          <p>金额：{{ item.total }}</p>
          <p>时间：{{ item.createtime_date }}</p>
        </div>

        <van-back-top :bottom="'80'" />
      </div>
    </van-list>
  </van-pull-refresh>
</template>

<script setup>
const { proxy } = getCurrentInstance();

const business = proxy.$business;
// 总数据
const list = ref([]);
//刷新状态
const refreshing = ref(false); 
//懒加载
const loading = ref(false);
//上拉加载状态
const finished = ref(false);
// 当前页
const page = ref(1);
//总数
const ListCount = ref(0);

const OnLoad = async () =>{
    // 如果刷新状态存在就关闭
    if(refreshing.value){
        refreshing.value = false;
    }
    let params = {
        busid:business.value.id,
        page:page.value
    }
    let result = await proxy.$http.post({
        url:'/business/record',
        params
    })
    loading.value = false;
    if(result.code === 1){
        list.value  = list.value.concat(result.data.list)
        console.log(list);
        ListCount.value = result.data.count
        if(list.value >= ListCount.value){
            finished === true;
            return false
        }
        page.value += page.value+1
    }else{
        finished.value = true;
        proxy.$fail(result.msg);
    }
}
</script>

<style scoped>
.item {
    background: #fff;
    width: 100%;
    font-size: 1em;
    padding: 15px 0;
    border-bottom: 1px solid #eaeaea;
}

.item p{
    padding: 0 15px;
}

.van-pull-refresh{
    min-height: 90vh;
}
</style>
